<template>
  <div class="page">
      <div v-if="!adminShow && !companyShow">
        <h2 class="headline text-yellow"><i class="fa fa-home"></i></h2>
        <div class="text-content">
          <h3><i class="fa fa-smile-o text-yellow"></i>  你好! {{name}}</h3>
        </div>
      </div>
      <admin-home
      v-if="adminShow"
      ref="admin-home"/>
      <company-home
      v-if="companyShow"
      ref="company-home"/>
  </div>
</template>

<script>
import {mapGetters} from 'vuex'
import {query} from '@/services/home'
import {RequestError} from '@/services/errors'
import {deepClone} from '@/utilities/object'
import adminHome from './home/adminHome'
import companyHome from './home/companyHome'
export default {
  name: 'home',
  components: {adminHome,companyHome},
  data: () => ({
      adminShow:true,
      companyShow:true
  }),
  computed: {
    name () {
      return sessionStorage.getItem('roleName') || '管理员'
    },
    ...mapGetters(['token'])
  },
  mounted() {
    // if(this.token.userType != '01'){
    //   this.adminShow = false;
    // }else{
    //   this.$refs['admin-home'].loadData();
    // }
    if(this.token.userType == '01'){
      this.$refs['admin-home'].loadData();
      this.companyShow = false;
    }else if(this.token.userType == '04'){
      this.$refs['company-home'].loadData();
      this.adminShow = false;
    }else{
      this.adminShow = false;
      this.companyShow = false;
    }
  },
  methods: {
   
  },
}
</script>

<style scope>
.clear:after {
    clear: both;
    content: " ";
    display: block;
    height: 0;
    overflow: hidden;
    visibility: hidden;
}
.page>div .headline {
    text-align: center;
    font-size: 120px;
    font-weight: 300;
}
.page>div .text-content>h3 {
    text-align: center;
}
.page>div .text-content>h3 {
    font-weight: 300;
    font-size: 25px;
}
.admin_content{
  width: 100%;
  margin-top: 20px;
}
.title{
  width: 100%;
  color: #666666;
  line-height: 42px;
  font-size: 14px;
  border-bottom: 1px solid #f6f6f6;
  text-indent: 15px;
}
.Toinfo{
  width: 50%;
  float: left;
  box-sizing: border-box;
  border: 10px solid #f6f6f6;
  padding: 0 10px 10px 0;
}
.Toinfo ul li{
  float: left;
  width: 50%;
  border-radius: 2px;
}
.Toinfo ul li div{
  display: block;
  padding: 10px 15px;
  background-color: #f8f8f8;
  color: #999;
  border-radius: 2px;
  margin: 10px 0 0 10px;
}
.Toinfo ul li h3{
  font-weight: 400;
  padding-bottom: 10px;
  font-size: 12px;
}
.Toinfo ul li p{
  font-size: 30px;
  color: #009688;
  line-height: 29px;
  width:200px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.hot ul li p{
  font-size: 14px;
}
.Toinfo ul .hot_ins{
  width: 100%;
}
.hot{
  border-left: 0;
}
.Echarts{
  float: left;
  width: 100%;
  margin: 0 0;
  box-sizing: border-box;
  border: 10px solid #f6f6f6;
  border-top: 0;
}
</style>
